import Taro from '@tarojs/taro'
import React, { PureComponent } from 'react'
// 界面组件
import { View, Text } from '@tarojs/components'
import { AtTextarea } from 'taro-ui'

import CTopbar from '@/components/CTopBar/index'
import CList from '@/components/CList'
import './index.scss'
import GetTopBarInfo from '@/utils/GetTopBarInfo' //动态高度
import { feedback_api } from './service'
/**
 * 建议反馈界面
 */

interface I {
  content: string
}

interface Feedback {
  state: I
}

class Feedback extends PureComponent<any> {
  constructor(props) {
    super(props)
    this.state = {
      content: '',
    }
  }

  // 输入框 内容改动触发事件
  handleChange(value) {
    this.setState({
      content: value,
    })
  }

  // 提交反馈
  submit() {
    const { content } = this.state
    console.log(content)

    if (content === '') {
      Taro.showToast({
        title: '请输入内容',
        icon: 'none',
        duration: 2000,
      })
      return
    }
    feedback_api(content).then(({ result, data, message }) => {
      if (result < 0) {
        Taro.showToast({
          title: message,
          icon: 'none',
          duration: 2000,
        })
        return
      } else {
        Taro.showToast({
          title: '反馈成功',
          icon: 'success',
          duration: 2000,
        })

        this.setState({
          content: '',
        })
      }
    })
  }
  render() {
    return (
      <View style={{ paddingTop: `${GetTopBarInfo().TopBarHeight}px` }}>
        <CTopbar title='建议反馈' showBack></CTopbar>
        <View className='content'>
          <View className='title'>反馈内容</View>
          <View>
            <AtTextarea
              height={600}
              count
              value={this.state.content}
              onChange={this.handleChange.bind(this)}
              maxLength={500}
              placeholder='你反馈的内容...'
            />
          </View>
        </View>
        <View className='footer'>
          <View onClick={this.submit.bind(this)}>提交</View>
        </View>
      </View>
    )
  }
}

export default Feedback
